import 'package:flutter/material.dart';
import 'package:get/get.dart';

import '../../base/utils/density_util.dart';
import '../../services/app_theme_services.dart';
import 'order_logic.dart';

class OrderPage extends StatelessWidget {
  const OrderPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final logic = Get.find<OrderLogic>();

    return Scaffold(
      appBar: AppBar(
        backgroundColor: AppThemeServices.appColors.background,
        elevation: 0,
        automaticallyImplyLeading: true,
        iconTheme: const IconThemeData(color: Colors.black),
        centerTitle: true,
        title: Text("我的订单", style: AppThemeServices.textTheme.appBarTitle),
      ),
      body: Container(
        child: Column(
          children: [
            Container(
              height: 60,
              child: TabBar(
                controller: logic.tabController,
                tabs: logic.titles.map((e) => Text(e)).toList(),
                labelStyle:
                    const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                labelColor: Colors.black,
                isScrollable: true,
                indicator: const BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage('assets/images/Vector.png'))
                    // gradient:
                    //LinearGradient(colors: [DColor.primary, Color(0xffFFB6A5)]),
                    ),
                indicatorSize: TabBarIndicatorSize.tab,
                unselectedLabelColor: const Color(0xFF333333),
                labelPadding: const EdgeInsets.only(
                    left: 13, right: 13, top: 5, bottom: 10),
                indicatorPadding:
                    const EdgeInsets.only(left: 15, right: 15, top: 35),
                unselectedLabelStyle: const TextStyle(fontSize: 14),
              ),
            ),
            Expanded(
              child: TabBarView(
                controller: logic.tabController,
                children: const <Widget>[
                  OrderChildItem(),
                  OrderChildItem(),
                  OrderChildItem(),
                  OrderChildItem(),
                  OrderChildItem(),
                ],
                // onPageChanged: (index) {
                //   printInfo(info: "当前index===${index}");
                //   logic.tabController.animateTo(index);
                //   logic.update();
                // },
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class OrderChildItem extends StatefulWidget {
  const OrderChildItem({Key? key}) : super(key: key);

  @override
  State<OrderChildItem> createState() => _OrderChildItemState();
}

class _OrderChildItemState extends State<OrderChildItem> {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: const Color(0xFFF7F8FA),
      width: Density.instance.screenWidth,
      // padding: const EdgeInsets.only(left: 12, right: 12),
      child: ListView.builder(
        padding: EdgeInsets.only(top: 0),
        physics: NeverScrollableScrollPhysics(),
        itemBuilder: (BuildContext context, int index) {
          return MychildItem();
        },
        itemCount: 10,
      ),
    );
  }
}

class MychildItem extends StatelessWidget {
  const MychildItem({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.all(10),
      padding: EdgeInsets.fromLTRB(11, 15, 10, 25),
      // width: 355,
      // height: 180,
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(7.5), color: Colors.white),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text('订单号: 5001131987090',
                  style: TextStyle(
                    fontSize: 13,
                    fontWeight: FontWeight.bold,
                    color: Color(0xff000000),
                  )),
              Text('已完成',
                  style: TextStyle(
                    fontSize: 12,
                    fontWeight: FontWeight.bold,
                    color: Color(0xff969799),
                  ))
            ],
          ),
          SizedBox(height: 10),
          Row(
            children: [
              Container(
                width: 72,
                height: 72,
                color: Colors.yellowAccent,
                // child: Image.asset("name"),
                child: Image.asset("assets/images/home_share_banner.png"),
              ),
              SizedBox(width: 8),
              Container(
                width: 179,
                height: 72,
                child: Column(
                  children: [
                    Container(
                      // color: Colors.red,
                      width: 179,
                      height: 20,
                      margin: EdgeInsets.only(top: 16),
                      alignment: Alignment.centerLeft,
                      child: Text('法国进口品牌女生时尚经典款法国进口品牌女生时尚经典款',
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                          style: TextStyle(
                            fontSize: 13,
                            color: Color(0xff323233),
                          )),
                    ),
                    Container(
                      // color: Colors.red,
                      width: 179,
                      height: 20,
                      margin: EdgeInsets.only(bottom: 16),
                      alignment: Alignment.centerLeft,
                      child: Text('颜色:棕红色 ; 款式:997',
                          style: TextStyle(
                            fontSize: 13,
                            color: Color(0xff323233),
                          )),
                    )
                  ],
                ),
              ),
              Container(
                // color: Colors.lightBlue,
                width: 60,
                height: 72,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.end,
                  children: [
                    Container(
                      child: const Text('￥11000',
                          style: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 11,
                              color: Color(0xffFF4D4D))),
                    ),
                    Container(
                      width: 60,
                      height: 19.5,
                      alignment: Alignment.centerRight,
                      child: Text('x1',
                          style: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 12,
                              color: Color(0xff969799))),
                    )
                  ],
                ),
              )
            ],
          ),
          SizedBox(height: 12),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text('共一件',
                  style: TextStyle(
                    fontSize: 14,
                    color: Color(0xff969799),
                  )),
              Container(
                width: 73,
                height: 29,
                alignment: Alignment.center,
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(45),
                    border: Border.all(width: 0.5, color: Color(0xff999999))),
                child: Text('再次购买',
                    style: TextStyle(
                      fontSize: 13,
                      color: Color(0xff323233),
                    )),
              )
            ],
          )
        ],
      ),
    );
  }
}
